<template>
    <div id="main" style="width:100%;height:600px"></div>
</template>

<script setup lang="ts">
import { onMounted, reactive } from 'vue'
import {Dcharts} from '../utils/Dcharts'
import { post } from '../utils/request'
const state = reactive({
    xAxis:[],
    yAxis:{},
})
const getData = () => {
    return new Promise( async (resolve,reject)=>{
        let res = await post("./Mock/barlabelrotation.json")
        if(res.result == 'y'){
            state.xAxis = res.data.xAxis
            state.yAxis = res.data.yAxis
            resolve("ok")
        }else{
            reject("error")
        }
    })
    
}
const initChart = async() =>{
    await getData()
    Dcharts.Dconfig({rotate:true})
    Dcharts.drawCharts("main",state.xAxis,state.yAxis)
}
onMounted(() => {
    initChart()
})

</script>

<style scoped>
</style>